<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vue 测试实例 -CND方式)</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
<div id="app">
  <p>{{ message }}</p>
    <div
    v-for="site in info"
  >
    {{ site.name }}
  </div>
</div>

<script>
new Vue({
  el: '#app',
  data:() {
    return{
         message: 'Hello Vue.js!CDN方式',
         info: null
        }
  },
   mounted () {
    axios
      .get('http://127.0.0.1:8000/')
      .then(response => (this.info = response.data.sites))
      .catch(function (error) { // 请求失败处理
        console.log(error);
      });
  }
})
</script>
</body>
</html>